window.addEventListener('load', function () {
    let s00 = document.querySelector('.s00')
    let s01 = document.querySelector('.s01')
    let d01 = document.querySelector('.d01')
    let problem01 = document.querySelector('.problem01')
    let s02 = document.querySelector('.s02')
    let d02 = document.querySelector('.d02')
    let problem02 = document.querySelector('.problem02')
    let s03 = document.querySelector('.s03')
    let d03 = document.querySelector('.d03')
    let problem03 = document.querySelector('.problem03')
    let flag = true;
    fun(problem01,'mouseenter', s00, 90);
    fun(problem01,'mouseleave', s00, 120);
    fun(s01,'mouseenter', d01, 0, () => {
        if (flag) {
            flag = false;
            d01.addEventListener('click', function () {
                // flag = confirm('问题已上报，gui')
                console.log('::::'+d01.style.color)
            })
        }
    },() => {
            s01.innerHTML = '->'
        fun(d01,'mouseenter', s00, 30);
        fun(s01,'mouseenter', s00, 90);
        // animateLeft(s00, 30);
    });
    fun(problem01,'mouseleave', d01, 90, () => {
        s01.innerHTML = '<-'
    });
    fun(s02,'mouseenter', d02, 0, () => {
        s02.innerHTML = '->'
        d02.addEventListener('click', function () {
            animateYPage(window, 0)
        })
    });
    fun(problem02,'mouseleave', d02, 90, () => {
        s02.innerHTML = '<-'
    });
    fun(s03,'mouseenter', d03, 0, () => {
        s03.innerHTML = '->'
        d03.addEventListener('click', function () {
            animateYPage(window, 2244)
        })
    });
    fun(problem03,'mouseleave', d03, 90, () => {
        s03.innerHTML = '<-'
    });

    function fun(dom, event, d, px, sum01, sum) {
        dom.addEventListener(event, function () {
            // dom.stopPropagation();
            // event.stopPropagation();
            if (sum01){
                sum01();
            }
            animateLeft(d, px,function () {
                if (sum){
                    sum();
                }
            });
        })
    }
})
